import 'package:bigegg/common/sp/xmm_shared_preferences_util.dart';
import 'package:bigegg/global/user/xmm_account_manager.dart';
import 'package:bigegg/global/xmm_app_const.dart';
import 'package:bigegg/utils/dialog/xmm_dialog_utils.dart';
import 'package:bigegg/utils/xmm_toast_util.dart';
import 'package:bigegg/widget/xmm_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../../global/routes/xmm_routes.dart';

class XmmSettingPage extends StatefulWidget {
  const XmmSettingPage({super.key});

  @override
  State<StatefulWidget> createState() {
    return XmmSettingPageState();
  }
}

class XmmSettingPageState extends State<XmmSettingPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: commonBgDecoration(),
        child: Column(
          children: [
            toolBarWidget(context, "Setting"),
            Stack(
              children: [
                Container(
                  margin: EdgeInsets.only(top: 90.w, left: 20.w),
                  child: Image.asset(
                    "assets/images/xmm_icon_about.png",
                    height: 91.w,
                  ),
                ),
                Align(
                  alignment: Alignment.topCenter,
                  child: Container(
                    margin: EdgeInsets.only(top: 81.w),
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(24),
                      child: Image.asset(
                        "assets/images/splash/xmm_splash_logo.png",
                        width: 80.w,
                        height: 80.w,
                      ),
                    ),
                  ),
                )
              ],
            ),
            const Text(
              "RallyRound",
              style: TextStyle(
                fontSize: 16,
                color: Color(0xFF404040),
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 32),
            Container(
              height: 171.w,
              width: 331.w,
              padding: EdgeInsets.only(left: 20.w, right: 20.w),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(12),
              ),
              child: Column(
                children: [
                  Expanded(
                    child: Container(
                      alignment: Alignment.centerLeft,
                      child: Row(
                        children: [
                          Text(
                            "ID : ${XmmAccountManager.instance.user.userId}",
                            style: TextStyle(
                              fontSize: 16.sp,
                              color: const Color(0xFF404040),
                            ),
                          ),
                          const Expanded(child: SizedBox()),
                          GestureDetector(
                            child: Image.asset(
                              "assets/images/xmm_icon_copy.png",
                              height: 16.w,
                              width: 16.w,
                            ),
                            onTap: () {
                              Clipboard.setData(ClipboardData(
                                  text:
                                      XmmAccountManager.instance.user.userId));
                              XmmToastUtils.show("Copy Successfully");
                            },
                          )
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    child: Container(
                      alignment: Alignment.centerLeft,
                      child: Row(
                        children: [
                          Text(
                            "Auto Translate",
                            style: TextStyle(
                              fontSize: 16.sp,
                              color: const Color(0xFF404040),
                            ),
                          ),
                          const Expanded(child: SizedBox()),
                          SizedBox(
                            height: 22.w,
                            child: FittedBox(
                              fit: BoxFit.fill,
                              child: CupertinoSwitch(
                                thumbColor: Colors.white,
                                activeColor: const Color(0xFF86FB8C),
                                value: XmmSPUtil.get(
                                    XmmAppConst.spAutoTranslateKey,
                                    defValue: true),
                                onChanged: (value) {
                                  XmmSPUtil.set(
                                      XmmAppConst.spAutoTranslateKey, value);
                                  setState(() {});
                                },
                              ),
                            ),
                          )
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    child: GestureDetector(
                      behavior: HitTestBehavior.opaque,
                      child: Container(
                        alignment: Alignment.centerLeft,
                        child: Row(
                          children: [
                            Text(
                              "Logout",
                              style: TextStyle(
                                fontSize: 16.sp,
                                color: const Color(0xFF404040),
                              ),
                            ),
                            const Expanded(child: SizedBox()),
                            Image.asset(
                              "assets/images/xmm_icon_right.png",
                              height: 16.w,
                              width: 16.w,
                            )
                          ],
                        ),
                      ),
                      onTap: () => logout(),
                    ),
                  ),
                  Expanded(
                    child: GestureDetector(
                      behavior: HitTestBehavior.opaque,
                      child: Container(
                        alignment: Alignment.centerLeft,
                        child: Row(
                          children: [
                            Text(
                              "Delete account",
                              style: TextStyle(
                                fontSize: 16.sp,
                                color: const Color(0xFF404040),
                              ),
                            ),
                            const Expanded(child: SizedBox()),
                            Image.asset(
                              "assets/images/xmm_icon_right.png",
                              height: 16.w,
                              width: 16.w,
                            )
                          ],
                        ),
                      ),
                      onTap: () => deleteAccount(),
                    ),
                  )
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  void logout() {
    XmmDialogUtils.showConfirmDialog("Confirm Logout?", () async {
      try {
        EasyLoading.show();
        await XmmAccountManager.instance.logout();
        Get.offAllNamed(XmmRoutes.loginPage);
      } finally {
        EasyLoading.dismiss();
      }
    });
  }

  deleteAccount() {
    XmmDialogUtils.showConfirmDialog("Confirm delete account?", () async {
      try {
        EasyLoading.show();
        await XmmAccountManager.instance.deleteAccount();
        Get.offAllNamed(XmmRoutes.loginPage);
      } finally {
        EasyLoading.dismiss();
      }
    });
  }
}
